<template>
  <a-modal
      title="更改站点"
      :width="400"
      :visible="visible"
      :confirmLoading="confirmLoading"
      @ok="handleSubmit"
      @cancel="handleCancel"
  >
    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
        <a-form-item
            label="所在车站"
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
        >
          <a-select
              v-decorator="['stationId', {initialValue: bike.bikeRecordType, rules: [{required: true, message: '请选择车主'}]}]"
              placeholder="请选择">
            <a-select-option v-for="station in stations" :key="station.stationId">{{
                station.stationName
              }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
import {editBike} from '@/api/basic/bike'
import {listStation} from "../../../../api/system/station";

export default {
  props: {
    options: {
      type: Array,
      required: true,
    }
  },
  data () {
    return {
      labelCol: {
        xs: {span: 24},
        sm: {span: 7}
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 16}
      },
      visible: false,
      confirmLoading: false,
      bike: {},
      stations: [],

      form: this.$form.createForm(this)
    }
  },
  methods: {
    edit (record) {
      this.visible = true
      this.bike = record
      listStation().then(res => {
        this.stations = res.result
      })
    },
    handleSubmit () {
      const {form: {validateFields}} = this
      this.confirmLoading = true
      validateFields((errors, values) => {
        if (!errors) {
          editBike(Object.assign(values, {'bikeId': this.bike.bikeId}))
              .then(res => {
                if (res.message !== 'error') {
                  this.visible = false
                  this.confirmLoading = false
                  this.form.resetFields()
                  this.$emit('ok')
                } else {
                  this.confirmLoading = false
                  this.$message.error('操作失败！')
                }
              }).catch(err => {
            console.log(err)
            this.confirmLoading = false
            this.$message.error('操作失败！')
          })
        } else {
          this.confirmLoading = false
        }
      })
    },
    handleCancel () {
      this.form.resetFields()
      this.visible = false
    }
  }
}
</script>
